import { UseSearch, UseTable } from '@/components';
import { PageContainer } from '@ant-design/pro-layout';
import {UploadOutlined} from '@ant-design/icons'
import { Card, Modal,Button,Upload,Input } from 'antd';
import React from 'react';
import moment from 'moment';
import ExecutionItem from './ExecutionItem';
import {getStr} from '../../../components/function';
import QCProjectController from '@/services/QCProject/QCProjectController';
const {TextArea} = Input
const {confirm} = Modal
class index extends React.Component {
    constructor(props) {
        super(props);
        this.state = { 
            userInfo:JSON.parse(sessionStorage.getItem("userInfo")),
            freshen:false
         };
    }
    freshen=()=>{
        this.setState({freshen:!this.state.freshen})
    }
    onRef=(ref)=>{
        this.setState({
            modal:ref
        })
    }
    getList=(query)=>{
        query.userName=this.state.userInfo.userName
        return QCProjectController.getExecutionList(query);
    }
    handleSearch=(query)=>{
        this.setState({query})
        this.freshen()
    }
    reset=()=>{
        this.setState({query:{}})
        this.freshen()
    }
    showModal=(rowData)=>{
        this.setState({
            rowData,
            visible:true
        })
    }
    handleChange=(info)=>{
        
        let fileList = [...info.fileList];
        fileList = fileList.slice(-2);
        fileList = fileList.map(file => {
      if (file.response) {
        file.url = file.response.url;

      }
      return file;
    });}
    textChange=(e)=>{this.setState({remark:e.target.value})}
    submit=()=>{   
                this.state.modal.submit()
       
    }
   onCancel=()=>{
    this.setState({visible:false})
    this.freshen()
   }
    render() {
        const {visible,query,freshen,rowData} = this.state
        const columns=[
            {title:'序号',dataIndex:'id',align:'center',render:(text,row,index)=>index+1},
            {title:'项目名称',dataIndex:'projectName',align:'center'},
            {title:'里程碑',children:[
                {title:'开始时间',dataIndex:'startDate',align:'center',render:text=>moment(text).format("YYYY-MM-DD")},
                {title:'结束时间',dataIndex:'endDate',align:'center',render:text=>moment(text).format("YYYY-MM-DD")},]},            
            {title:'工作安排',dataIndex:'description',align:'center',render:text=>getStr(text)},
            {title:'阶段成果',dataIndex:'files',align:'center',render:text=>text?'已执行':'未执行'},
            {title:'操作',render:(text,rowData)=>{return<div>
                {!rowData.files&&<Button onClick={this.showModal.bind(this,text,rowData)} style={{margin:5}} type={'primary'}>执行</Button>}
            </div>}},
        ]
        const searchItem=[
            {name:'项目名称',keyName:'projectName',valueType:'text'},
        ]
        return (
            <PageContainer>
                <Card>
                    <UseSearch searchItem={searchItem} handleSearch={this.handleSearch} reset={this.reset}/>
                </Card>
                <Card>
                    <UseTable getData={this.getList} columns={columns} query={query} refresh={freshen} rowKey={'id'}/>
                </Card>
                
                {visible&&<Modal
                visible={visible}
                title={'执行'}
                width={'60%'}
                onCancel={this.onCancel}
                onOk={this.submit}
                >
                <ExecutionItem rowData={rowData} onRef={this.onRef} onCancel={this.onCancel}/>
                </Modal>}
                
            </PageContainer>
        );
    }
}

export default index;